@import './custom.less';

@content11: content11;
.@{content11} {
  height: 144px;
  background-color: #2687cc;
  h1 {
    color: white;
  }
  p {
    color: white;
  }
  &-contentWrapper {
    //height: 60%;
    display: flex;
    margin: 0px 80px 0px 80px;
    flex-direction: column;
    &-r {
      .cell {
        display: inline-block;
        width: 20%;
        padding: 2%;
        vertical-align: top;
        .img {
          display: inline-block;
          width: 15%;
          vertical-align: top;
        }
        .text {
          width: 85%;
          display: inline-block;
          padding-left: 8%;
        }
      }
    }
  }
}

@media screen and (max-width: 767px) {
  .@{content11}-wrapper {
    //height: 920px;
    .@{content11} {
      overflow: hidden;
      width: 100%;
      margin: auto;
      > h1, > p {
        position: relative;
        top: auto;
      }
      > h1 {
        margin: 40px auto 20px;
        font-size: 24px;
      }
      &-contentWrapper {
        top: auto;
        margin: 20px;
        height: auto;
        ul {
          > li {
            position: relative;
            width: 50%;
            padding: 2.5%;
            display: inline-block;
            h1 {
              font-size: 20px;
            }
            &.queue-anim-leaving {
              position: relative !important;
            }
          }
        }
      }
    }
  }
}
